<template>
  <div>
    <a-divider orientation='left'>分红明细</a-divider>
    <f-table ref='orderDrugs' :tableColumns='columns1' rowKey='orderDetailsId' :scroll='{x:true}'  :operator='operator' :params='queryParam' :dataSource='dataSource' :showPagination='false'   :autoLoad='false'  :multiple='false'>
      <span slot='action' slot-scope='text, record'>
        <template>
            <a @click='openBonusInfoDetailsDrawer(record)' >订单明细</a>
            <a-divider type='vertical' />
            <a @click='openBonusInfoDetailsDrawer(record)' >导出</a>
        </template>
       </span>
    </f-table>
    <a-divider orientation='left'>部门总监提成(写明金额计算公式)</a-divider>
    <a-descriptions bordered size='small' :column='5' layout="vertical">
      <a-descriptions-item label='区域'>
        商务一部
      </a-descriptions-item>
      <a-descriptions-item label='部门总监'>
        汤凯
      </a-descriptions-item>
      <a-descriptions-item label='结余利润'>
        8000
      </a-descriptions-item>
      <a-descriptions-item label='10%利润'>
       800
      </a-descriptions-item>
      <a-descriptions-item label='应发放月度分红'>
        0
      </a-descriptions-item>
    </a-descriptions>
    
    <a-modal title='拆分订单' v-model='chaiModal' v-if='chaiModal' width='800px' height='400px' @cancel='handleChaiCancel' @ok='handleChaiFenSubmit'>
      <f-form ref='chaiForm' :action='api.bod.chaiFen' v-if='chaiModal' :form-key='this.formItem.orderDetailsId'>
        <f-form-item label='拆分方式' type='radio' name='returnType' :required='true' dataType='number' :data='api.busOrder.returnType' :value.sync='formItem.returnType' />
        <f-form-item label='拆分数量' type='number' v-if='formItem.returnType==1' data-type='number' name='returnNum' :required='true' :value='formItem.saleNum-1' :max='formItem.saleNum-1' :min='1' />
        <f-form-item label='拆分金额' type='number' v-if='formItem.returnType==2' data-type='number' name='returnAmount' :required='true' :value='formItem.saleAmount-1' :max='formItem.saleAmount-1' :min='1' />
      </f-form>
    </a-modal>

    <bonus-info-order-drawer ref="bonusInfoOrderDrawer"></bonus-info-order-drawer>
  </div>

</template>

<script>
import api from "../../../js/api"
import BonusInfoOrderDrawer from "./bonus_info_order_drawer"

export default {
  name: "BonusInfo",
  components: { BonusInfoOrderDrawer },
  data() {
    let me = this
    //操作按钮
    let operator = []
    return {
      api: Object.assign(api, this.api),
      //列表初始化查询参数
      queryParam: {},
      processImageVisible: false,
      supplierId: "",
      returnType: 1,
      saleType: '',
      order: {},
      fileIds: [],//上传文件ID
      returnModal: false,
      returnModal2: false,
      chaiModal: false,
      formItem: this.getFormItem(),

      orderForm: {},
      detailsModal: false,
      operator: operator,
      dataSource:[
        {
          orderDetailsId:1,
          saleManName:'汤凯',
          profit:58743.21,
          surplusProfit:28743,
          costAmount:5478,
          teamAmount:2000,
          salary:8000,
          bonusAmount:3200,
        },
        {
          orderDetailsId:2,
          saleManName:'吴晓红',
          profit:38743.21,
          surplusProfit:18743,
          costAmount:4478,
          teamAmount:2000,
          salary:8000,
          bonusAmount:3200,
        },
        {
          orderDetailsId:2,
          saleManName:'总监',
          profit:38743.21,
          surplusProfit:18743,
          costAmount:4478,
          teamAmount:2000,
          salary:8000,
          bonusAmount:3200,
        }
      ],
      columns1: [{
        title: "负责人",
        align: "center",
        ellipsis: true,
        width: "120px",
        dataIndex: "saleManName"
      }, {
        title: "利润",
        align: "center",
        width: "80px",
        dataIndex: "surplusProfit"
      }, {
        title: "费用",
        align: "center",
        width: "80px",
        dataIndex: "costAmount"
      }, {
        title: "利润结余",
        align: "center",
        width: "80px",
        dataIndex: "profit"
      }, {
        title: "团建费",
        align: "center",
        width: "80px",
        dataIndex: "teamAmount"
      }, {
        title: "实发薪资",
        align: "center",
        width: "80px",
        dataIndex: "salary"
      }, {
        title: "月度分红",
        align: "center",
        width: "80px",
        dataIndex: "bonusAmount"
      },{
        title: "操作",
        align: "center",
        dataIndex: "action",
        width: "80px",
        scopedSlots: { customRender: "action" }
      }],
      columns2: []
    }
  },
  created() {
  },
  computed: {
   
  },
  methods: {
    getFormItem() {
      return {
        returnId: "",
        saleNum: 0,
        noReturnNum: 0,
        returnType: 0,
        noReturnAmount: "",
        sendDate: "",
        hkImage: []
      }
    },
   
    setData(data) {
      if (data && data.paymentId) {
        let params = {
          paymentId: data.paymentId,
          handlerName: "orderGetHandler"
        }
       /* this.http.get(this, {
          url: this.api.busOrder.get,
          params: params,
          success: function(me, data) {
            me.orderForm = data
            me.loaded = true
          }
        })*/
        this.queryParam.paymentId = data.paymentId
        this.$refs.orderDrugs.refresh()
      }
    },

    openBonusInfoDetailsDrawer(record) {
      this.$refs.bonusInfoOrderDrawer.showDrawer(record)
    },
    //文件上传回调
    uploadSuccess(fileUrl, files, fileIds) {
      this.fileIds = fileIds
    },
    handleSubmit() {
      let params = {
        orderId: this.queryParam.orderId,
        orderDetailsId: this.formItem.orderDetailsId,
        yfkAmount: this.formItem.returnAmount
      }
      this.$refs["returnForm"].submit(params, this.handleSuccess)
    },
    handleSubmit2() {
      let params = {
        orderId: this.queryParam.orderId,
        orderDetailsId: this.formItem.orderDetailsId,
      }
      this.$refs["returnForm2"].submit(params, this.handleSuccess2)
    },
    handleChaiFenSubmit() {
      let params = {
        orderId: this.queryParam.orderId,
        orderDetailsId: this.formItem.orderDetailsId,
      }
      this.$refs["chaiForm"].submit(params, this.handleChaiSuccess)
    },
    //删除回款
    delReturnDetails(record) {
      this.http.confirm(this, {
        content: "确认删除吗?",
        url: api.payment.remove,
        data: {
          handlerName:'huikuanPaymentDeleteHandler',
          processInstanceId:record.processInstanceId,
          ids: record.returnId
        },
        success: function(me, data) {
          me.$refs["orderDrugs"].refresh()
          me.$refs["returnDetails"].refresh(false);
        }
      })
    },
    handleSuccess() {
      this.$refs["orderDrugs"].refresh()
      this.$refs["returnDetails"].refresh(false)
      this.returnModal = false
    },
    handleSuccess2() {
      this.$refs["orderDrugs"].refresh()
      this.$refs["returnDetails"].refresh(false)
      this.returnModal2 = false
    },
    handleChaiSuccess() {
      this.$refs["orderDrugs"].refresh()
      this.chaiModal = false
    },
    handleChaiCancel() {
      this.chaiModal = false
    },
    handleCancel() {
      this.returnModal = false
    },
    handleCancel2() {
      this.returnModal2 = false
    },
    processImg(order) {
      this.processInstanceId = order.processInstanceId
      this.processImageVisible = true
    },
    //重新提交
    completeTask(paymentId) {
      this.http.confirm(this, {
        content: "确认提交审批吗?",
        url: api.tasktodo.complete,
        requestBody: true,
        data: {
          taskId: paymentId.taskId
        },
        success: function(me, data) {
          me.$refs.table.refresh()
        }
      })
    },
    startProcess(order) {
      this.http.confirm(this, {
        content: "确认提交审批吗?",
        url: api.processInstance.start,
        requestBody: true,
        data: {
          handlerName: "paymentHuikuanStartProcessHandler",
          businessKey: order.returnId
        },
        success: function(me, data) {
          me.$refs.returnDetails.refresh()
        }
      })
    },
    revokeHandle(order) {
      this.http.confirm(this, {
        content: "确认撤销回款吗?",
        url: api.bod.revoke,
        data: {
          returnId: order.returnId
        },
        success: function(me, data) {
          me.$refs.returnDetails.refresh()
        }
      })
    },
    addTuibu(record, saleType) {
      this.tuiFormItem = record
      this.saleType = saleType
      if (saleType == 3) {
        this.$nextTick(() => {
          if (this.tuiFormItem.saleNum < 0) {
            this.tuiFormItem.saleNum = this.tuiFormItem.saleNum * -1
          }
        })
      }
      this.detailsModal = true
    },
    deleteTuibu(record) {
      this.http.confirm(this, {
        content: '确认删除吗?',
        url: api.bod.deleteTuibu,
        data: {
          orderDetailsId: record.orderDetailsId
        },
        success: function(me, data) {
          me.$refs['orderDrugs'].refresh()
        }
      })
    },
    tuiHandleSubmit() {
      let params = {
        orderDetailsId: this.tuiFormItem.orderDetailsId,
        saleNum:this.tuiFormItem.saleNum,
        saleType: this.saleType
      }
      this.$refs['tuibuForm'].submit(params, this.tuiHandleSuccess)
    },
    tuiHandleSuccess() {
      this.$refs['orderDrugs'].refresh()
      this.detailsModal = false
    },
    tuiHandleCancel() {
      this.detailsModal = false
    }
  }
}
</script>